<script setup lang="ts">
import {passWord} from "@/http/Personal center";
import {ref} from "vue";
import {useCounterStore} from "@/stores/counter";


const ID=useCounterStore()
// const Idnumber=ID.userInfo.id
// console.log(Idnumber)
const onClickLeft = () => history.back();

const dataone=ref({
    id: ID.userInfo.id,
    newPassword:'',
    password: '',
})
const newPassword=ref('')
const password=ref('')
function Save(){
    dataone.value.newPassword=newPassword.value
    dataone.value.password=password.value
    // console.log(newPassword.value)
    // console.log(password.value)
    // console.log(data.value.newPassword)
    // console.log(data.value.password)
    passWord(dataone.value).then(res=>{
        // console.log(res)
    })
}
// console.log(dataone.value.id)
</script>

<template>
<div>
    <van-nav-bar
            title="标题"
            left-text="返回"
            left-arrow
            @click-left="onClickLeft"
    />
    <div class="pass">
        <div>密码</div>
        <input v-model="newPassword" type="text" placeholder="请输入新密码" id="word">
    </div>
    <div class="word">
          <div>确认密码</div>
        <input v-model="password" type="text" placeholder="请再次输入密码" id="pass">
    </div>
    <div class="cente">
    <van-button type="primary" to="/shezhi" id="chend" @click="Save">保存</van-button>
    </div>

</div>
</template>

<style scoped lang="less">
.pass{
    width: 100%;
    height:80px;
    padding: 10px;
    font-size: 14px;
    margin-top: 10px;
    background-color: white;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    #word{
        width: 60%;
        height: 30px;
        border: none;
    }
}
.word{
    width: 100%;
    height:80px;
    padding: 10px;
    font-size: 14px;
    margin-top: 10px;
    background-color: white;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    #pass{
        border: none;
        width: 60%;
        height: 30px;
    }
}
.cente{
    text-align: center;
    #chend{
        width: 60%;
        margin-top: 300px;
    }
}
</style>